import React, { Component } from 'react';
import { PropType } from 'prop-types'
import { connect } from 'dva';
import { Table, Card, Button } from 'antd';
import { Link } from 'dva/router'

const styles = {
  deleteButton: {
    marginLeft: '20px'
  }
}
class FaqManage extends Component {
  constructor(props) {
    super(props);
    this.state = {}
  }

  rowSelection = {
    onChange: (selectedRowKeys, selectedRows) => {
      console.log(selectedRowKeys)
      
        this.props.dispatch({
          type: 'faqManage/updateState',
          payload: { selectedRowKeys}
        })
     
      
    }
  };

  //删除问题
  onDelete = () => {
    this.props.dispatch({
      type: 'faqManage/delete',
      payload: this.props.faqManage.selectedRowKeys
    })
  }

  //页面选择
  changePage = (page, pageSize) => {
    this.props.dispatch({
      type: 'faqManage/query',
      payload: {
        page,
        start: pageSize * (page - 1),
        size: pageSize,
      }
    })
  };

  render() {
    const { faqList, pagination } = this.props.faqManage;
    const code = sessionStorage.getItem('code');
    console.log(code)
    const columns = [{
      title: '错误码',
      dataIndex: 'errorCode',
      key:'errorCode'
    }, {
      title: '问题',
      dataIndex: 'question',
      key:'question'
    }, {
      title: '详情',
      dataIndex: 'id',
      key:'id',
        render: (text, record) => <Link to={`/chzu/faqManage/faqDetail?id=${record.rowguid}`}>详情</Link>
    }];

    return (
      <Card
        title="FAQ管理"
        extra={<div>
          {
            code === '2' ? 
            <div>
              <Link to="/chzu/faqManage/faqDetail">
              <Button type="primary">
                新建问题
              </Button>
            </Link>
            <Button
              style={styles.deleteButton}
              onClick={this.onDelete}>删除</Button>
            </div> : ''
          }
          
        </div>}>
        <Table
          rowKey='id'
          rowSelection={this.rowSelection}
          columns={columns}
          dataSource={faqList}
          pagination={{
            ...pagination,
            showTotal: total => `共有${pagination.total}条数据`,
            onChange: this.changePage,
          }} />
      </Card>
    )
  }
}

export default connect(({ faqManage }) => ({ faqManage }))(FaqManage)